<template>
  <div class="content-block block-5">
    <div class="info-head flex align-center">
      {{ title }}
      <el-date-picker
        class="date-picker"
        v-model="month" type="month"
        format="yyyy-MM" value-format="yyyy-MM"
        :clearable="false" :picker-options="pickerOptions"
      ></el-date-picker>
    </div>
    <div class="info-content" ref="container">
      <v-chart ref="chart" :option="chartOption" :style="{width: '100%',height: height}"></v-chart>
    </div>
  </div>
</template>

<script>
import Mixin from './mixin'
import { GAS, GAS_TEXT } from '@/config'

export default {
  name: 'grid-item-five',
  mixins: [Mixin],
  data () {
    return {
      color: '#e83e8c',
      type: GAS,
      typeText: GAS_TEXT,
    }
  },
}
</script>

<style scoped>

</style>
